.app-promo {
	position: relative;
	max-width: 300px;
	margin: 0 auto 5px;
	padding: 5px 0;
	overflow: hidden;

	@include breakpoint( '<660px' ) {
		display: none;
	}
}

.app-promo .app-promo__icon {
	position: absolute;
	top: 15px;
	left: 20px;
}

.app-promo .app-promo__dismiss {
	position: absolute;
	right: 17px;
	top: 12px;
	cursor: pointer;

	svg {
		fill: var( --color-neutral-10 );
	}
}

.app-promo .app-promo__link {
	display: block;
	margin: 0 10px;
	padding: 8px 34px 8px 50px;
	background-color: var( --color-surface );
	color: var( --color-primary );
	font-size: 12px;
	box-shadow: 0 0 0 1px rgba( var( --color-neutral-10-rgb ), 0.5 ),
		0 1px 2px var( --color-neutral-0 );

	&:hover {
		text-decoration: underline;
		cursor: pointer;
	}
}

.app-promo__dialog {
	max-width: 480px;
}

button.app-promo__link {
	text-align: left;
}
